<template>
  <mk-breadcrumb :breadcrumb-data="breadcrumbData" :login-staff="{staffName:currentStaffData.name,staffAvatar:avatar}"
                 @handle-edit="handleEdit"></mk-breadcrumb>
</template>

<script>
import { mapState } from 'vuex'
import staffService from '../services/staff'
export default {
  name: 'breadcrumb',
  props: [ 'breadcrumbData'],
  computed: mapState({
    currentStaffData: state => state.staff.currentStaff
  }),
  mounted: function() {
  },
  methods: {
    handleEdit(data, callback) {
      staffService.modifyPassword({
        'oldPassword': data.oldPassword, 'newPassword': data.newPassword
      }, () => {
        this.$nextTick(() => {
          callback(true);
        });
      }, () => {
        this.$nextTick(() => {
          callback(false);
        });
      });
    }
  },
  data() {
    return {

    }
  },
}
</script>

<style lang="less">
  .breadcrumb-box {
    margin-bottom:10px;
    .assess-icon {
      background-image: url('../assets/img/bread-assess.png');
    }
    .customer-icon {
      background-image: url('../assets/img/bread-customer.png');
    }
    .doctor-icon {
      background-image: url('../assets/img/bread-doctor.png');
    }
    .operation-icon {
      background-image: url('../assets/img/bread-operation.png');
    }
    .order-icon {
      background-image: url('../assets/img/bread-order.png');
    }
    .order-icon {
      background-image: url('../assets/img/bread-order.png');
    }
    .pay-icon {
      background-image: url('../assets/img/bread-pay.png');
    }
    .product-icon {
      background-image: url('../assets/img/bread-product.png');
    }
    .service-icon {
      background-image: url('../assets/img/bread-service.png');
    }
    .setting-icon {
      background-image: url('../assets/img/bread-site.png');
    }
    .circle-icon{
      background-image: url('../assets/img/bread-circle.svg');
    }
  }
</style>
